<!--
 * @Description: 回退
 * @Author: wangwangwang
 * @Date: 2020-12-17 15:06:55
 * @LastEditors: wangwangwang
 * @LastEditTime: 2021-04-14 14:37:13
-->
<template>
  <el-dialog v-dialogDrag width="50%" title="请选择回退的节点" :before-close="hanldeClose" :visible.sync="visible">
    <el-table border :header-cell-style="{ background: '#f3f6f9' }" style="width:100%" :data="tableData" :span-method="objectSpanMethod" highlight-current-row @row-click="rowClick">
      <!-- <el-table-column
        type="selection"
        width="55">
      </el-table-column> -->
      <el-table-column label width="35">
        <template slot-scope="scope">
            <el-radio v-model="radioId" :label="scope.row.id">&nbsp;</el-radio>
          </template>
      </el-table-column>
      <el-table-column prop="nodeName" label="节点名称"></el-table-column>
      <el-table-column prop="userName" label="处理人">
      </el-table-column>
      <el-table-column prop="approvalStatus" label="状态">
        <template slot-scope="scope">
          <span>{{['未审批','待处理','已审批','审批通过','审批不通过','已撤销','已回退','','','','发起'][scope.row.approvalStatus]}}</span>
        </template>
      </el-table-column>
    </el-table>
    <span slot="footer" class="dialog-footer">
      <el-button class="bottom_all_two" @click="hanldeClose">取 消</el-button>
      <el-button class="bottom_all" @click="hanldeSure">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
export default {
  props: ["visible", 'tableData'],
  data () {
    return {
      spanArr: [],
      selectData: '',
      radioId: '',
    }
  },
  watch: {
    tableData (data) {
      this.getSpanArr(data);
    }
  },
  methods: {
    rowClick(row){
      this.radioId = row.id;
      this.selectData = row;
    },
    hanldeClose() {
      this.$emit("closeModel");
    },
    hanldeSure() {
      if (!this.radioId) {
        this.$message.warning('请选择要回退的节点');
        return
      }
      this.$emit("hanldeSure", this.selectData);
    },
    getSpanArr(data) {
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1);
          this.pos = 0
        } else {
          if (data[i].nodeName === data[i - 1].nodeName) {
            this.spanArr[this.pos] += 1;
            this.spanArr.push(0);
          } else {
            this.spanArr.push(1);
            this.pos = i;
          }
        }
      }
    },
    objectSpanMethod({ rowIndex, columnIndex }) {
      if (columnIndex === 1 || columnIndex === 3) {
        const _row = this.spanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col
        }
      }
    }
  }
}
</script>
<style scoped>
</style>
